<template>
	<view class="contentBox">
		<!-- <image mode="widthFix" src="https://yqy.psbc.com/prod-api/saas/finance/S62070022?picName=zjgckzx" mode=""></image> -->
		<image v-for="(item,index) in longImgs" :key="index" :src="pageType ==1 ? download(item) : downloadBkPic(item)"
			mode="widthFix"></image>

		<u-loading-page :loading="isLoading" loading-text="加载中..."></u-loading-page>
	</view>
</template>

<script>
	import {
		baseURL,
		download,
		downloadVideo,
		downloadBkPic
	} from "@/utils/util.js";

	export default {
		data() {
			return {
				baseURL,
				isLoading: true,
				longImgs: [],
				image: {},
				pageType: 1
			};
		},

		onLoad: function(option) {
			if (option.pageImg) {
				this.pageType = 2
				this.longImgs = [option.pageImg]
			} else {
				this.pageType = 1
				this.longImgs = uni.getStorageSync('productLongImgItemMsg').pictureIdList
			}

			this.handleSetImageStyle()
			setTimeout(() => {

				this.isLoading = false
			}, 2000)
		},
		methods: {
			download,
			downloadBkPic,
			onShareAppMessage(res) {
				return {
					title: this.pageType == 2 ? '建筑工程数字化转型解决方案' : '邮储银行公司金融易启典',
					// path: '/pages/index/index'
				}
			},
			onShareTimeline() {
				return {
					title: this.pageType == 2 ? '建筑工程数字化转型解决方案' : '邮储银行公司金融易启典',
					// path: '/pages/index/index'
				}
			},
			//js 简写
			async handleSetImageStyle() {
				// 由于方法是异步的，渲染时高度会不生效，所以要加await
				let imageInfoObj = await uni.getImageInfo({
					src: this.longImgs[0]
					// src:'https://yqy.psbc.com/prod-api/saas/finance/S62070022?picName=zjgckzx'
				})
				// this.isLoading = false

				// 取到图片的宽高
				let {
					width,
					height
				} = imageInfoObj[1]

				// this.$set('isLoading', false)
				//配合image的mode使用只需要设置宽度
				this.$set(this.image, 'width', width)



			}
		}
	}
</script>
<style lang="scss" scoped>
	.contentBox {

		background-color: #FAFAFA;
		margin-bottom: 20rpx;
		font-size: 24rpx;

		image {
			width: 100vw; // 设置最大宽度不能超过屏幕
		}
	}
</style>